
<div>
  <div class="wrapper-sm">
    <div class="panel panel-default" style="margin-bottom:-5px;border-radius:5px">
      <div class="panel-body" style="font-size: 10px;padding:5px 20px; " >
        <div class="m-t-xs m-t-sm">
          <span>设备档案</span>
          <i class="fa fa-angle-right"></i>
          <span>维保工单 </span>
          <i class="fa fa-angle-right"></i>
          <span>工单详情</span>
        </div>
      </div>
    </div>
  </div>
  <div class="wrapper-sm" style="font-size:12px" *ngIf="data">
    <div class="panel panel-default" style="border-radius:5px">
      <div class="panel-body">
        <div class="m-t-n-xs m-b-md" style="text-align:center;color:white;background-color:#56abe4;line-height:50px;font-size:25px">工单编号：{{weibaoId}}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
          <span>工单状态：确认</span>


        </div>
        <div id="lrzj_x1">
          <ul id="timl1">
            <li  style="color:orange;background:url('../../../../../assets/img/biggerdot.png') center bottom no-repeat">
              <span>维保提醒</span><br/>
              <span class="icon iconfont icon-jingbaodeng" style="font-size:25px"></span>
            </li>
            <li style="color:orange;background:url('../../../../../assets/img/biggerdot.png') center bottom no-repeat">
              <span>确认</span><br />
              <span class="icon iconfont icon-yijie" style="font-size:25px"></span>
            </li>
            <li>
              <span>恢复</span><br />
              <span class="icon iconfont icon-yiqueren" style="font-size:25px;color:gray"></span>
            </li>

          </ul>
          <div class="m-t-sm">

            <span style="margin-left:140px" >{{data.status[0].created}}</span>
            <span style="margin-left:180px" >{{time}}</span>

          </div>

          <div class="panel panel-default m-t-md">
            <div class="panel-heading" >
              基本信息
            </div>
            <div class="panel-body">
              <div class="m-l-md m-t-sm" style="font-size:14px;color:#23b7e5 "><b>工单信息</b></div>
              <div class="list-group-item ">
                <div class="row">
                  <span class="col-sm-6" >工单编号：{{weibaoId}}</span>

                  <span class="col-sm-6" >维保提醒时间：{{data.weibao.created}}</span>
                </div>
              </div>
              <div class="list-group-item">
                <div class="row">
                  <span class="col-sm-6" >维保类型：<span *ngFor="let weibaoleix of data.weibao.records">{{weibaoleix.display_name}}</span></span>
                </div>
              </div>


              <div class="m-l-md m-t-sm" style="font-size:14px;color:#23b7e5 "><b>设备信息</b></div>
              <div class="list-group-item ">
                <div class="row">
                        <span class="col-sm-6">
                            空压站：{{data.group.name}}
                        </span>
                        <span class="col-sm-6">
                            设备编号：{{data.device.mac}}
                        </span>
                </div>
              </div>
              <div class="list-group-item">
                <div class="row">
                  <span class="col-sm-6">设备品牌：{{data.device.brand}}</span>
                  <span class="col-sm-6">产品名称：{{data.device.product_name}}</span>
                </div>
              </div>

              <div class="m-l-md m-t-sm" style="font-size:14px;color:#23b7e5 "><b>维保信息</b></div>
              <div class="list-group-item">
                <div class="row">
                  <span class="col-sm-6">空压站联系人：{{data.group.lxr}}</span>
                  <span class="col-sm-6">空压站联系人电话：{{data.group.lxdh}}</span>
                </div>
              </div>

              <div class="list-group-item">
                <div class="row">
                  <span class="col-sm-6">维保联系人：{{data.wbxx.nick_name}}</span>
                  <span class="col-sm-6">维保联系人电话：{{data.wbxx.mobile}}</span>
                </div>
              </div>
            </div>

          </div>
          <div class="panel panel-default m-t-sm" *ngIf="detailData">
            <div class="panel-heading">
              确认信息
            </div>
            <div class="panel-body">
              <div class="list-group-item ">
                <div class="row">
                      <span class="col-sm-6">
                        <div class="form-inline">
                          <label>是否需要到场：</label>
                          <select [(ngModel)]="daochang">
                            <option value="">--请选择--</option>
                            <option value="1">是</option>
                            <option value="0">否</option>
                          </select>
                        </div>
                      </span>
                      <span class="col-sm-6">
                          确&nbsp;&nbsp;&nbsp;认&nbsp;&nbsp;&nbsp;人：{{username}}
                      </span>
                </div>
              </div>
              <div class="list-group-item ">
                <div class="form-horizontal">
                  <div class="form-group">
                    <label class="col-sm-2">维保内容：</label>
                    <div class="m-l-sm">
                      <textarea class="form-control" rows="3" [(ngModel)]="des"></textarea>
                    </div>
                  </div>
                </div>
              </div>
              <div class="list-group-item">
                <div class="row">
                  <span class="col-sm-6">
                    <label>维保人员</label>
                    <a style="color:#23b7e5;"><i class="fa fa-user-plus" aria-hidden="true" style="font-size:18px"></i></a>
                  </span>

                </div>
              </div>

              <div class="list-group-item">
                <table  class="table table-hover table-striped m-b-none default footable " style="font-size: 12px;height: auto">
                  <thead>
                  <tr>
                    <th  style="width:10%"></th>
                    <th  style="width:20%">账号</th>
                    <th  style="width:20%">姓名</th>
                    <th  style="width:25%">手机号</th>
                    <th  style="width:25%">所属组织</th>
                  </tr>
                  </thead>
                  <tbody>
                  <tr *ngFor="let item of detailData.wbrys">
                    <td>
                      <input type="checkbox" name="checkbox" (click)="fn($event,item.id)">
                    </td>
                    <td>{{item.username}}</td>
                    <td>{{item.nick_name}}</td>
                    <td>{{item.mobile}}</td>
                    <td>{{item.company_name}}</td>
                  </tr>
                  </tbody>
                </table>
              </div>

              <div class="list-group-item">
                <div style="text-align:center">
                  <a class="btn btn-sm btn-info" (click)="save()">确定</a>
                  <a class="btn btn-sm btn-default" (click)="cancel()">返回</a>
                </div>
              </div>

            </div>
          </div>

        </div>

      </div>
    </div>
  </div>
</div>



